<template>
    <div id="p_timeauto" class="p_task">            
            <scroller lock-x scrollbar-y use-pullup :pullup-config="pullupConfig2" height="-97" ref="habitScrol" @on-pullup-loading="loadNext" :scroll-bottom-offset="200">
                <group class="group0">                    
                    <div v-if="actionArrComputed==0" style="text-align:center;" ><img src="/static/z39h5/img/none.png" width="200" /></div>
                    
                    <swipeout>
                        <swipeout-item v-if="index<pageShowNum" v-for="(item, index) in actionArrComputed" :key="index" ref="actionMove" >
                            <div slot="right-menu">
                                <swipeout-button @click.native="onDelClick('call',item,index)" type="warn">删除</swipeout-button>
                            </div>
                            <div slot="content" class="vux-1px-t">
                                <t-cell :title="item.title" :tagTop="item" :value="item.duration" :inline-desc="item.desc||(item.start +'-'+item.end + ' ' + item.addr)">
                                    <img slot="icon" :src="item.img || '/static/z39h5/img/logo.png'">
                                </t-cell>
                            </div>
                        </swipeout-item>
                    </swipeout>
                </group>

          </scroller>                
        
    </div>
</template>
<script>
import moment from "moment";

import api from '../../api';
import {
    mapState,
    mapActions
} from 'vuex'
let lifeFlagArr =[{name:"自定义",value:"custom",img:'logo'},
                {name:"醒",value:"wakeup",img:'wakeup'},
                {name:"起床",value:"getup",img:'getup'},
                {name:"洗漱1",value:"wash1",img:'wash'},
                {name:"洗澡",value:"bath",img:'bath'},
                {name:"厕所",value:"wc=10",img:'wc'},
                {name:"早饭",value:"breakfast",img:'eat'},
                {name:"录音",value:"tape",img:'record'},
                {name:"学习",value:"study",img:'study'},
                {name:"去上班",value:"gowork",img:'gowork'},
                {name:"上班",value:"workStart",img:'workStart'},
                {name:"工作准备",value:"workReady",img:'workReady'},
                {name:"腹肌撕裂者T4",value:"health",img:'health'},
                {name:"午饭",value:"lunch",img:'eat'},
                {name:"卡通",value:"cartoon",img:'cartoon'},
                {name:"晚饭",value:"dinner",img:'eat'},
                {name:"下班",value:"workEnd",img:'workEnd'},
                {name:"回家",value:"gohome",img:'gohome'},
                {name:"洗漱2",value:"wash2",img:'wash'},
                {name:"睡觉",value:"sleep",img:'sleep'}] ;

import TCell from "../t-cell/index.vue"

import {
    Tab,
    TabItem,
    TransferDomDirective as TransferDom,
    Toast,
    Swipeout,
    SwipeoutItem,
    SwipeoutButton,
    XButton,
    PopupPicker,
    Group,
    Picker,
    Box,
      XInput,
      XTextarea,Flexbox, FlexboxItem,Datetime,
    ButtonTab,    ButtonTabItem,  Scroller,
    Sticky
} from 'vux'

export default {
    directives: {
        TransferDom
    },
    components: {
        TCell,
        Tab,
        TabItem,
            Toast,
            Swipeout,
            SwipeoutItem,
            SwipeoutButton,
            XButton,
        PopupPicker,
        Group,
        Picker,
        Box,
          XInput,
          XTextarea,Flexbox, FlexboxItem,Datetime,
        ButtonTab,    ButtonTabItem,  Scroller,
        Sticky
    },
    computed: {
        actionArrComputed(){
            let today = moment().format("YYYY-MM-DD") ;
            var temp = this.actionArr.filter(function (action) {return action.typea==1  && action.timeday==today } ); 
            this.pageTotal = temp.length / this.pageNumOne ;
            if(this.pageTotal <= 1){
                setTimeout(() => {
                  this.$refs.habitScrol.disablePullup();
                }, 100)
            }else{
                setTimeout(() => {
                  this.$refs.habitScrol.enablePullup();
                }, 100)
            }
            this.$nextTick(() => {
                this.$refs.habitScrol.reset()
            })
            return temp;
        },
        ...mapState({
            uid: state => state.vux.uid,
            actionArr: state => state.z39.actionArr
        })
    },
    watch: {
        
    },
    created() {        
       try{ if(isApp)runWatch() }catch(e){ console.log("app not ready") };
    },
    mounted: function() {        
        
    },
    methods: {
        initPage(){
            if( this.uid == 0 )return ;
            if( this.actionArr.length == 0 ){
                let day = moment().format("YYYY-MM-DD") ;
                this.taskautoGet({timeday:day});
            }
        },
        taskautoGet:function(sdata){
            api.taskautoGet(sdata).then(data => {
				if(data == undefined) data={errmsg:"网络错误",errno:1001};
                if (data.errno != 0) return this.$vux.toast.show({text: data.errmsg ,type: 'warn'});
                
                data = data.data;     
                let acts = data.acts ;
                let day = sdata.timeday ;
                this.$store.commit({type:"z39/actionSet",acts,day});
            })
        },
        getNameByKey(key){
            var temp = _.find(lifeFlagArr,function(item){ return item.value == key}) ;
            return temp.name ;
        },
        getItemByKey(key){
            var temp = _.find(lifeFlagArr,function(item){ return item.value == key}) ;
            return temp ;
        },
        onDelClick(type, item, index) {
            console.log(item);
            this.taskDel(item, index,true);
        },
        getData: function() {
            
        },   
        taskDel:function(action,index,show){            
            var tempIndex = this.actionArr.indexOf( action ) ;
            if( !action.id ){  //如果还未上传到服务器,本地则直接删除.
                this.actionArr.splice(tempIndex, 1) ;
                return ;
            }
            let _this = this;
            let _data = _.clone(action) ;
            api.taskautoDel({id:_data.id }).then(data => {
                if(!show && data.errno !=0) return ;  // 不显示提示.
				if(data.errno !=0) return this.$vux.toast.show({text: data.errmsg ,type: 'warn'});
                
				data = data.data;           
				this.actionArr.splice(tempIndex,1);                 
				if(!show) return ;  // 不显示提示.
				this.$vux.toast.show({
					text: "删除成功",
					type: 'success'
				})
                
            })
        },
        loadNext(){
            if( this.pageIndex < this.pageTotal ){
                this.pageIndex ++ ;
                this.pageShowNum = this.pageIndex * this.pageNumOne ;
                // console.log("pageShowNum",this.pageShowNum) ;
                this.$refs.habitScrol.donePullup() ;
            }
			this.checkClosePullup();
        },
		checkClosePullup(){
            this.$refs.habitScrol.reset();
			if( this.pageIndex >= this.pageTotal){
				setTimeout(() => {
					this.$refs.habitScrol.disablePullup()
				}, 100)	
			}
		},
        readyReset(){  //  @touchend="readyReset"
			return ;
            if( this.resetId > 0){
                clearTimeout(this.resetId);
            }
            let _this = this ;
            this.resetId = setTimeout(() => {
                _this.pageIndex=1 ;
                _this.pageShowNum = _this.pageIndex * _this.pageNumOne ;
                _this.$nextTick(() => {
                    _this.$refs.habitScrol.reset({top: 0}) ;
                })
                _this.resetId = -1 ;
            },120000) //120000
        },
        ...mapActions([
            
        ])
    },
    data() {
        return {            
            resetId: -1,
            pageIndex: 1 ,
            pageTotal: 2 ,
            pageShowNum:15,
            pageNumOne: 15 ,
              pullupConfig2: {
                content: '上拉加载更多',
                downContent: '松开进行加载',
                upContent: '上拉加载更多',
                loadingContent: '加载中...'
              }
        }
    }
}

</script>
<style scoped>
#p_timeauto .vux-button-group{
    background-color: #fff; 
    padding-top: 1px;
}
#p_timeauto .timeBtn{width:70px;}
#p_timeauto .day {
    padding:2px 6px ;
    height: 32px;
}
#p_timeauto .day .vux-tab-item{
    background: #fff;
    line-height: 28px;    font-size: 16px;
}
#p_timeauto .day .vux-tab-selected {
    background: #eee;border-radius: 6px;
}

</style>
<style>

#p_timeauto .weui-search-bar:before {
    height: 0;
    border-top: 0;
}
#p_timeauto .day  .vux-tab-selected {
    background: #eee;
    border-radius: 4px;
}
</style>